import React, { useEffect, useState } from 'react';
import { Table, Button, Card, message, Select, Form, Input, Space, Row, Col, Modal, Typography, Alert, Tag, Divider, Tabs } from 'antd';
import { DatabaseConfig, databaseConfigApi, sqlExportApi, SqlExportRequest, SqlResponse, TableColumn as ApiTableColumn } from '../services/api';
import type { ColumnsType } from 'antd/es/table';
import { EyeOutlined, DownloadOutlined, FileOutlined } from '@ant-design/icons';
import * as api from '../services/api';

const { Option } = Select;
const { TextArea } = Input;
const { Title, Paragraph, Text } = Typography;

// 扩展API中的TableColumn类型，添加columnComment字段
interface TableColumn extends ApiTableColumn {
    columnComment?: string;
}

// 定义表格列类型
type DataColumn = {
    title: string;
    dataIndex: string;
    key: string;
    ellipsis?: boolean;
    width?: number | string;
};

// 添加MySQL转PostgreSQL的转换函数
const convertToPostgreSQL = (mysqlSql: string): string => {
    let pgSql = mysqlSql;
    
    // 替换注释格式
    pgSql = pgSql.replace(/^-- /gm, '-- ');
    
    // 替换表名和字段名的引号（MySQL使用反引号，PostgreSQL使用双引号）
    pgSql = pgSql.replace(/`([^`]+)`/g, '"$1"');
    
    // 处理INSERT语句
    pgSql = pgSql.replace(/INSERT INTO/g, 'INSERT INTO');
    
    // 替换MySQL特有的数据类型
    pgSql = pgSql.replace(/\bint\(\d+\)/gi, 'integer');
    pgSql = pgSql.replace(/\btinyint\(\d+\)/gi, 'smallint');
    pgSql = pgSql.replace(/\bmediumint\(\d+\)/gi, 'integer');
    pgSql = pgSql.replace(/\bbigint\(\d+\)/gi, 'bigint');
    pgSql = pgSql.replace(/\bfloat\(\d+,\d+\)/gi, 'real');
    pgSql = pgSql.replace(/\bdouble\(\d+,\d+\)/gi, 'double precision');
    pgSql = pgSql.replace(/\bvarbinary\(\d+\)/gi, 'bytea');
    pgSql = pgSql.replace(/\blongblob/gi, 'bytea');
    pgSql = pgSql.replace(/\blongtext/gi, 'text');
    pgSql = pgSql.replace(/\bvarchar\(\d+\)/gi, (match) => {
        const size = match.match(/\d+/);
        return `character varying(${size})`;
    });
    
    // 添加PostgreSQL专用的头部信息
    pgSql = `-- ======================================================\n` +
            `-- MySQL转PostgreSQL导出文件\n` +
            `-- ======================================================\n` +
            `-- 注意: 此文件是由MySQL SQL自动转换为PostgreSQL格式\n` +
            `-- 可能需要根据实际情况进行调整\n` +
            `-- ======================================================\n\n` +
            pgSql;
    
    return pgSql;
};

// 瀚高转换函数增强
const convertToHighgo = (mysqlSql: string): string => {
  const sequences: Array<{tableName: string, columnName: string, dataType: string}> = [];
  const columnComments: Array<{tableName: string, columnName: string, comment: string}> = [];
  
  // 处理CREATE TABLE语句
  let result = mysqlSql.replace(
    /CREATE\s+TABLE\s+(?:IF\s+NOT\s+EXISTS\s+)?`([^`]+)`\s*\(\s*([\s\S]*?)\s*\)(?:\s*ENGINE\s*=\s*\w+)?(?:\s*DEFAULT\s+CHARSET\s*=\s*\w+)?(?:\s*COLLATE\s*=\s*\w+)?(?:\s*ROW_FORMAT\s*=\s*\w+)?(?:\s*COMMENT\s*=\s*'([^']*)')?(?:\s*;)?/gi,
    (match, tableName, columns, tableComment) => {
      // 提取表注释
      const tableCommentStr = tableComment ? 
        `\n\nCOMMENT ON TABLE ${tableName} IS '${tableComment.replace(/'/g, "''")}';\n` : '';
      
      // 清理列定义
      const cleanedColumns = columns.replace(/\s*,\s*/g, ',\n  ').split(',');
      
      // 处理列定义
      const processedColumns = cleanedColumns.map((col: string) => {
        // 处理列定义，提取列名、数据类型、约束和注释
        const columnMatch = col.trim().match(/^`([^`]+)`\s+([^\s,]+)(?:\s*\(\s*([^)]+)\s*\))?(.*)$/);
        
        if (!columnMatch) return col.trim();
        
        const [, columnName, dataType, dataLength, rest] = columnMatch;
        
        // 提取列注释
        const commentMatch = rest.match(/\s+COMMENT\s+['"]([^'"]+)['"]/i);
        const comment = commentMatch ? commentMatch[1] : null;
        
        // 如果有注释，保存起来稍后生成COMMENT ON语句
        if (comment) {
          columnComments.push({
            tableName,
            columnName,
            comment: comment.replace(/'/g, "''")
          });
        }
        
        // 移除注释部分
        let columnDef = rest.replace(/\s+COMMENT\s+['"][^'"]+['"]/i, '');
        
        // 检查是否为自增列
        const isAutoIncrement = columnDef.includes('AUTO_INCREMENT');
        
        // 处理自增列
        if (isAutoIncrement) {
          // 根据数据类型选择合适的序列类型
          let sequenceType;
          if (dataType.toUpperCase() === 'BIGINT') {
            sequenceType = 'bigint';
          } else if (dataType.toUpperCase() === 'SMALLINT') {
            sequenceType = 'smallint';
          } else {
            sequenceType = 'integer';
          }
          
          // 保存序列信息
          sequences.push({
            tableName,
            columnName,
            dataType: sequenceType
          });
          
          // 移除AUTO_INCREMENT
          columnDef = columnDef.replace(/\s+AUTO_INCREMENT/i, '');
        }
        
        // 处理数据类型
        let pgDataType;
        if (dataType.toUpperCase() === 'INT' || dataType.toUpperCase() === 'INTEGER') {
          pgDataType = 'integer';
        } else if (dataType.toUpperCase() === 'DATETIME') {
          pgDataType = 'timestamp without time zone';
        } else if (dataType.toUpperCase() === 'TINYINT' && (dataLength === '1' || dataLength === '2')) {
          pgDataType = 'boolean';
        } else if (dataType.toUpperCase() === 'TINYINT') {
          pgDataType = 'smallint';
        } else if (dataType.toUpperCase() === 'TEXT') {
          pgDataType = 'text';
        } else if (dataType.toUpperCase() === 'BLOB') {
          pgDataType = 'bytea';
        } else {
          pgDataType = dataLength ? `${dataType}(${dataLength})` : dataType;
        }
        
        // 构建列定义
        return `${columnName} ${pgDataType}${columnDef}`;
      });
      
      // 对表名不使用引号
      const createTableSql = `CREATE TABLE ${tableName} (\n  ${processedColumns.join(',\n  ')}\n)`;
      
      // 生成序列SQL
      const sequenceSql = sequences
        .filter(seq => seq.tableName === tableName)
        .map(seq => {
          const seqName = `${tableName}_${seq.columnName}_seq`;
          return `CREATE SEQUENCE ${seqName};\n` +
            `ALTER TABLE ${tableName} ALTER COLUMN ${seq.columnName} SET DEFAULT nextval('${seqName}');\n` +
            `ALTER SEQUENCE ${seqName} OWNED BY ${tableName}.${seq.columnName};`;
        })
        .join('\n');
      
      // 生成列注释SQL
      const columnCommentSql = columnComments
        .filter(cc => cc.tableName === tableName)
        .map(cc => `COMMENT ON COLUMN ${cc.tableName}.${cc.columnName} IS '${cc.comment}';`)
        .join('\n');
      
      // 组合最终SQL
      return `${createTableSql};${sequenceSql ? `\n\n${sequenceSql}` : ''}${tableCommentStr}${columnCommentSql ? `\n${columnCommentSql}` : ''}`;
    }
  );
  
  // 如果存在其他SQL语句（ALTER TABLE, CREATE INDEX等），则处理
  if (result === mysqlSql) {
    result = processOtherStatements(mysqlSql);
  }
  
  // 替换MySQL双引号，但保留单引号（用于字符串值）
  result = result.replace(/"/g, "'").replace(/'([^']+)'/g, "'$1'");
  
  // 清理结果
  result = result
    .replace(/\n{3,}/g, '\n\n')  // 移除过多的空行
    .trim();  // 移除前后空格
  
  return result;
};

// 达梦转换函数增强
const convertToDM = (mysqlSql: string): string => {
    // 保存原始SQL语句，用于处理多条语句
    const originalSql = mysqlSql;
    
    // 使用更简单直接的方法处理SQL转换
    // 1. 提取CREATE TABLE语句和表名
    const createTableMatch = mysqlSql.match(/CREATE\s+TABLE\s+(?:IF\s+NOT\s+EXISTS\s+)?`([^`]+)`\s*\(([\s\S]*?)\)(?:\s*(?:ENGINE|ROW_FORMAT|DEFAULT CHARSET|COLLATE|AUTO_INCREMENT|COMMENT)\s*=?\s*[^;]*)*;/i);
    
    if (!createTableMatch) {
        // 如果没有匹配到CREATE TABLE语句，只进行基本的语法替换
        let result = processOtherStatements(mysqlSql);
        return result;
    }
    
    const tableName = createTableMatch[1]; // 表名
    const columnsText = createTableMatch[2]; // 列定义文本
    
    // 2. 提取表注释
    const tableCommentMatch = mysqlSql.match(/COMMENT\s*=\s*['"](.*?)['"](?:\s|$)/i);
    const tableComment = tableCommentMatch ? tableCommentMatch[1] : null;
    
    // 3. 解析列定义
    let processedColumns = '';
    const commentStatements = [];
    
    // 将列定义按逗号分割，但忽略字符串中的逗号
    const columnDefinitions = [];
    let current = '';
    let inString = false;
    let stringChar = '';
    
    for (let i = 0; i < columnsText.length; i++) {
        const char = columnsText[i];
        
        if ((char === "'" || char === '"') && (i === 0 || columnsText[i-1] !== '\\')) {
            if (!inString) {
                inString = true;
                stringChar = char;
            } else if (stringChar === char) {
                inString = false;
            }
        }
        
        if (char === ',' && !inString) {
            columnDefinitions.push(current.trim());
            current = '';
        } else {
            current += char;
        }
    }
    
    if (current.trim()) {
        columnDefinitions.push(current.trim());
    }
    
    // 处理每个列定义
    for (const columnDef of columnDefinitions) {
        // 先检查是否是主键或索引定义
        if (columnDef.toUpperCase().includes('PRIMARY KEY') || 
            columnDef.toUpperCase().includes('UNIQUE KEY') || 
            columnDef.toUpperCase().includes('KEY ') || 
            columnDef.toUpperCase().includes('INDEX ')) {
            
            // 提取索引定义
            let cleanedDef = columnDef;
            
            // 处理PRIMARY KEY
            if (columnDef.toUpperCase().includes('PRIMARY KEY')) {
                cleanedDef = columnDef.replace(/USING\s+BTREE/i, '');
                cleanedDef = cleanedDef.replace(/`([^`]+)`/g, '"$1"');
                processedColumns += '  ' + cleanedDef + ',\n';
                continue;
            }
            
            // 处理UNIQUE KEY / INDEX
            if (columnDef.toUpperCase().includes('UNIQUE KEY') || 
                columnDef.toUpperCase().includes('UNIQUE INDEX')) {
                // 将UNIQUE KEY转换为UNIQUE约束
                const uniqueMatch = columnDef.match(/UNIQUE\s+(?:KEY|INDEX)\s+`([^`]+)`\s*\(([^)]+)\)/i);
                if (uniqueMatch) {
                    const constraintName = uniqueMatch[1];
                    const columns = uniqueMatch[2].replace(/`/g, '"');
                    cleanedDef = `CONSTRAINT "${constraintName}" UNIQUE (${columns})`;
                    processedColumns += '  ' + cleanedDef + ',\n';
                    continue;
                }
            }
            
            // 处理普通KEY / INDEX - 达梦支持在CREATE TABLE中定义普通索引
            const keyMatch = columnDef.match(/(?:KEY|INDEX)\s+`([^`]+)`\s*\(([^)]+)\)/i);
            if (keyMatch) {
                const indexName = keyMatch[1];
                const columns = keyMatch[2].replace(/`/g, '"');
                // 转换为达梦索引语法
                cleanedDef = `INDEX "${indexName}" (${columns})`;
                processedColumns += '  ' + cleanedDef + ',\n';
                continue;
            }
            
            // 如果以上都不匹配，保留原始定义
            cleanedDef = cleanedDef.replace(/`([^`]+)`/g, '"$1"');
            processedColumns += '  ' + cleanedDef + ',\n';
            continue;
        }
        
        // 这是普通列定义
        const nameMatch = columnDef.match(/^\s*`([^`]+)`/);
        if (!nameMatch) continue; // 跳过无效的列定义
        
        const columnName = nameMatch[1];
        
        // 提取注释
        const commentMatch = columnDef.match(/COMMENT\s*['"](.+?)['"]/i);
        if (commentMatch) {
            const comment = commentMatch[1].replace(/'/g, "''"); // 转义单引号
            commentStatements.push(`COMMENT ON COLUMN "${tableName}"."${columnName}" IS '${comment}';`);
        }
        
        // 去除COMMENT部分
        let cleanedDef = columnDef.replace(/\s*COMMENT\s*['"].*?['"]/i, '');
        
        // 替换数据类型
        cleanedDef = cleanedDef.replace(/int\(\d+\)/gi, 'INT');
        cleanedDef = cleanedDef.replace(/tinyint\(\d+\)/gi, 'SMALLINT');
        cleanedDef = cleanedDef.replace(/bigint\(\d+\)/gi, 'BIGINT');
        cleanedDef = cleanedDef.replace(/varchar\(\d+\)/gi, function(match) {
            const size = match.match(/\d+/);
            return `VARCHAR(${size})`;
        });
        cleanedDef = cleanedDef.replace(/datetime/gi, 'TIMESTAMP');
        cleanedDef = cleanedDef.replace(/text/gi, 'TEXT');
        
        // 处理自增列 - 达梦使用IDENTITY(1,1)
        if (cleanedDef.toUpperCase().includes('AUTO_INCREMENT')) {
            const autoIncrementMatch = cleanedDef.match(/`[^`]+`\s+(\w+)(?:\(\d+\))?/);
            let dataType = 'INT';
            
            if (autoIncrementMatch) {
                const typeStr = autoIncrementMatch[1].toLowerCase();
                if (typeStr === 'bigint') {
                    dataType = 'BIGINT';
                } else if (typeStr === 'smallint') {
                    dataType = 'SMALLINT';
                }
            }
            
            // 替换AUTO_INCREMENT为IDENTITY
            cleanedDef = cleanedDef.replace(/(\s+)AUTO_INCREMENT/i, ' IDENTITY(1,1)');
        }
        
        // 替换反引号为双引号
        cleanedDef = cleanedDef.replace(/`([^`]+)`/g, '"$1"');
        
        processedColumns += '  ' + cleanedDef + ',\n';
    }
    
    // 移除最后一个逗号
    processedColumns = processedColumns.replace(/,\n$/, '\n');
    
    // 构建完整的SQL
    let dmSql = `-- ======================================================\n`;
    dmSql += `-- MySQL转达梦数据库导出文件\n`;
    dmSql += `-- ======================================================\n`;
    dmSql += `-- 注意: 此文件是由MySQL SQL自动转换为达梦数据库格式\n`;
    dmSql += `-- 可能需要根据实际情况进行调整\n`;
    dmSql += `-- ======================================================\n\n`;
    dmSql += `-- 达梦数据库与MySQL语法存在差异，以下转换可能需要手动调整：\n`;
    dmSql += `-- 1. 自增列：MySQL的AUTO_INCREMENT已转为达梦的IDENTITY(1,1)\n`;
    dmSql += `-- 2. 存储引擎：达梦不使用ENGINE参数\n`;
    dmSql += `-- 3. 默认值：某些默认值表达式可能需要调整\n`;
    dmSql += `-- 4. 字段注释：已转换为COMMENT ON COLUMN语法\n`;
    dmSql += `-- 5. 触发器和存储过程：语法差异较大，需要手动转换\n`;
    dmSql += `-- 6. 索引和约束：部分索引和约束可能需要调整\n\n`;
    
    // 添加表创建语句
    dmSql += `CREATE TABLE "${tableName}" (\n${processedColumns});\n\n`;
    
    // 添加表注释
    if (tableComment) {
        const escapedTableComment = tableComment.replace(/'/g, "''");
        dmSql += `-- 添加表注释\n`;
        dmSql += `COMMENT ON TABLE "${tableName}" IS '${escapedTableComment}';\n\n`;
    }
    
    // 添加列注释
    if (commentStatements.length > 0) {
        dmSql += `-- 添加列注释\n`;
        dmSql += commentStatements.join('\n') + '\n';
    }
    
    // 处理INSERT语句
    const insertRegex = /INSERT\s+INTO\s+`([^`]+)`\s*\(([^)]+)\)\s*VALUES\s*(\([^;]+\))(?:\s*,\s*(\([^;]+\)))*\s*;/gi;
    let insertMatch;
    
    while ((insertMatch = insertRegex.exec(mysqlSql)) !== null) {
        const insertTableName = insertMatch[1];
        if (insertTableName === tableName) {
            const columns = insertMatch[2];
            const valuesList = insertMatch[3];
            
            // 替换反引号为双引号
            const fixedColumns = columns.replace(/`([^`]+)`/g, '"$1"');
            // 不需要修改VALUES部分的格式
            
            dmSql += `\n-- 插入数据\n`;
            dmSql += `INSERT INTO "${insertTableName}" (${fixedColumns}) VALUES ${valuesList};\n`;
        }
    }
    
    return dmSql;
};

// 处理其他SQL语句的函数
const processOtherStatements = (mysqlSql: string): string => {
    let result = mysqlSql;
    
    // 替换反引号，区分处理表名、索引名和列名
    // 表名和索引名添加双引号，列名不添加双引号
    result = result.replace(/`([^`]+)`/g, (match, name) => {
        // 这里简单替换，后续再针对特定情况处理
        return name;
    });
    
    // 处理ALTER TABLE语句
    // 1. 处理ALTER TABLE ADD COLUMN
    result = result.replace(
        /ALTER\s+TABLE\s+([^\s]+)\s+ADD\s+(?:COLUMN\s+)?([^\s]+)\s+([^,;]+)(?:\s+COMMENT\s+['"]([^'"]+)['"])?/gi,
        (match, tableName, columnName, columnDef, comment) => {
            // 对表名添加双引号
            tableName = tableName.replace(/^([^"]+)$/, '"$1"');
            // 列名不添加双引号
            let sql = `ALTER TABLE ${tableName} ADD ${columnName} ${columnDef}`;
            
            // 如果有注释，使用COMMENT ON语句
            if (comment) {
                const escapedComment = comment.replace(/'/g, "''");
                sql += `;\nCOMMENT ON COLUMN ${tableName}.${columnName} IS '${escapedComment}'`;
            }
            
            return sql;
        }
    );
    
    // 2. 处理ALTER TABLE MODIFY COLUMN
    result = result.replace(
        /ALTER\s+TABLE\s+([^\s]+)\s+(?:MODIFY|CHANGE)\s+(?:COLUMN\s+)?([^\s]+)\s+([^\s]+)\s+([^,;]+)(?:\s+COMMENT\s+['"]([^'"]+)['"])?/gi,
        (match, tableName, oldColumnName, newColumnName, columnDef, comment) => {
            // 对表名添加双引号
            tableName = tableName.replace(/^([^"]+)$/, '"$1"');
            // 列名不添加双引号
            // 对于MODIFY，新旧列名相同；对于CHANGE，可能不同
            const finalColumnName = oldColumnName === newColumnName ? oldColumnName : newColumnName;
            
            // PostgreSQL/达梦使用ALTER TABLE ALTER COLUMN TYPE
            let sql = `ALTER TABLE ${tableName} ALTER COLUMN ${finalColumnName} TYPE ${columnDef}`;
            
            // 如果有注释，使用COMMENT ON语句
            if (comment) {
                const escapedComment = comment.replace(/'/g, "''");
                sql += `;\nCOMMENT ON COLUMN ${tableName}.${finalColumnName} IS '${escapedComment}'`;
            }
            
            return sql;
        }
    );
    
    // 3. 处理ALTER TABLE RENAME COLUMN
    result = result.replace(
        /ALTER\s+TABLE\s+([^\s]+)\s+RENAME\s+COLUMN\s+([^\s]+)\s+TO\s+([^\s]+)/gi,
        (match, tableName, oldColumnName, newColumnName) => {
            // 对表名添加双引号
            tableName = tableName.replace(/^([^"]+)$/, '"$1"');
            // 列名不添加双引号
            return `ALTER TABLE ${tableName} RENAME COLUMN ${oldColumnName} TO ${newColumnName}`;
        }
    );
    
    // 4. 处理CREATE INDEX
    result = result.replace(
        /CREATE\s+(?:(UNIQUE)\s+)?INDEX\s+([^\s]+)\s+ON\s+([^\s]+)\s*\(([^)]+)\)(?:\s+USING\s+\w+)?/gi,
        (match, unique, indexName, tableName, columns) => {
            // 添加瀚高/PostgreSQL特有的语法元素
            const uniqueKeyword = unique ? 'UNIQUE ' : '';
            // 对表名和索引名添加双引号
            indexName = indexName.replace(/^([^"]+)$/, '"$1"');
            tableName = tableName.replace(/^([^"]+)$/, '"$1"');
            // 对列名不添加双引号
            // 添加USING btree和TABLESPACE
            return `CREATE ${uniqueKeyword}INDEX ${indexName} ON ${tableName} USING btree (${columns}) TABLESPACE pg_default`;
        }
    );
    
    // 5. 处理DROP语句
    // DROP TABLE
    result = result.replace(
        /DROP\s+TABLE\s+(?:IF\s+EXISTS\s+)?([^\s]+)/gi,
        (match, tableName) => {
            // 对表名添加双引号
            tableName = tableName.replace(/^([^"]+)$/, '"$1"');
            return `DROP TABLE IF EXISTS ${tableName}`;
        }
    );
    
    // DROP INDEX
    result = result.replace(
        /DROP\s+INDEX\s+(?:IF\s+EXISTS\s+)?([^\s]+)(?:\s+ON\s+([^\s]+))?/gi,
        (match, indexName, tableName) => {
            // 对索引名添加双引号
            indexName = indexName.replace(/^([^"]+)$/, '"$1"');
            if (tableName) {
                // 对表名添加双引号，如果存在
                tableName = tableName.replace(/^([^"]+)$/, '"$1"');
                return `DROP INDEX IF EXISTS ${indexName} ON ${tableName}`;
            }
            return `DROP INDEX IF EXISTS ${indexName}`;
        }
    );
    
    // 6. 处理Truncate语句
    result = result.replace(
        /TRUNCATE\s+(?:TABLE\s+)?([^\s]+)/gi,
        (match, tableName) => {
            // 对表名添加双引号
            tableName = tableName.replace(/^([^"]+)$/, '"$1"');
            return `TRUNCATE TABLE ${tableName}`;
        }
    );
    
    // 7. 处理事务语句
    result = result.replace(/START\s+TRANSACTION/gi, 'BEGIN');
    result = result.replace(/COMMIT/gi, 'COMMIT');
    result = result.replace(/ROLLBACK/gi, 'ROLLBACK');
    
    // 8. 处理INSERT语句 - 确保列名不带引号
    result = result.replace(
        /INSERT\s+INTO\s+([^\s]+)\s*\(([^)]+)\)\s*VALUES/gi,
        (match, tableName, columns) => {
            // 对表名不使用引号
            return `INSERT INTO ${tableName} (${columns}) VALUES`;
        }
    );
    
    // 9. 删除MySQL特有的ENGINE, CHARSET等设置
    result = result.replace(/ENGINE\s*=\s*\w+/gi, '');
    result = result.replace(/DEFAULT\s+CHARSET\s*=\s*\w+/gi, '');
    result = result.replace(/COLLATE\s*=\s*\w+/gi, '');
    result = result.replace(/ROW_FORMAT\s*=\s*\w+/gi, '');
    
    return result;
};

const SqlExportPage: React.FC = () => {
    const [form] = Form.useForm();
    const [databaseConfigs, setDatabaseConfigs] = useState<DatabaseConfig[]>([]);
    const [filteredConfigs, setFilteredConfigs] = useState<DatabaseConfig[]>([]);
    const [tables, setTables] = useState<string[]>([]);
    const [tableColumns, setTableColumns] = useState<TableColumn[]>([]);
    const [exportedSql, setExportedSql] = useState<string>('');
    const [previewSql, setPreviewSql] = useState<string>('');
    const [previewVisible, setPreviewVisible] = useState<boolean>(false);
    const [previewData, setPreviewData] = useState<any[]>([]);
    const [loading, setLoading] = useState<boolean>(false);
    const [searchKeyword, setSearchKeyword] = useState('');
    const [modalVisible, setModalVisible] = useState(false);
    const [dataColumns, setDataColumns] = useState<DataColumn[]>([]);
    const [databaseId, setDatabaseId] = useState<number | null>(null);
    const [searchText, setSearchText] = useState<string>('');
    const [databases, setDatabases] = useState<{id: number, name: string}[]>([]);
    // 新增手动SQL转换相关状态
    const [sqlConvertModalVisible, setSqlConvertModalVisible] = useState<boolean>(false);
    const [manualSql, setManualSql] = useState<string>('');
    const [convertLoading, setConvertLoading] = useState<boolean>(false);
    // 添加预览相关状态
    const [previewConvertVisible, setPreviewConvertVisible] = useState<boolean>(false);
    const [previewDmSql, setPreviewDmSql] = useState<string>('');
    const [previewHighgoSql, setPreviewHighgoSql] = useState<string>('');
    const [activePreviewTab, setActivePreviewTab] = useState<string>('dm');
    // 添加分页相关状态
    const [pagination, setPagination] = useState<{
        current: number;
        pageSize: number;
    }>({
        current: 1,
        pageSize: 20
    });
    // 添加选择行相关状态
    const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
    const [selectedRows, setSelectedRows] = useState<any[]>([]);

    // 示例SQL语句
    const exampleSql = `-- 这是一个MySQL示例SQL，包含CREATE TABLE和INSERT语句
CREATE TABLE \`example_table\` (
  \`id\` int(11) NOT NULL AUTO_INCREMENT,
  \`name\` varchar(100) NOT NULL COMMENT '名称',
  \`code\` varchar(50) DEFAULT NULL COMMENT '编码',
  \`status\` tinyint(4) DEFAULT '0' COMMENT '状态：0-禁用，1-启用',
  \`type\` enum('A','B','C') DEFAULT 'A' COMMENT '类型',
  \`description\` text COMMENT '描述',
  \`create_time\` datetime DEFAULT CURRENT_TIMESTAMP COMMENT '创建时间',
  \`update_time\` datetime DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '更新时间',
  PRIMARY KEY (\`id\`) USING BTREE,
  UNIQUE KEY \`uk_code\` (\`code\`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_general_ci ROW_FORMAT=DYNAMIC COMMENT='示例表';

-- 插入示例数据
INSERT INTO \`example_table\` (\`name\`, \`code\`, \`status\`, \`type\`, \`description\`) VALUES 
('示例名称1', 'CODE001', 1, 'A', '这是第一条示例数据'),
('示例名称2', 'CODE002', 1, 'B', '这是第二条示例数据'),
('示例名称3', 'CODE003', 0, 'C', '这是第三条示例数据');`;

    useEffect(() => {
        loadDatabaseConfigs();
    }, []);

    useEffect(() => {
        if (searchKeyword) {
            const filtered = databaseConfigs.filter(config => 
                config.name.toLowerCase().includes(searchKeyword.toLowerCase()) ||
                config.host.toLowerCase().includes(searchKeyword.toLowerCase()) ||
                config.databaseName.toLowerCase().includes(searchKeyword.toLowerCase())
            );
            setFilteredConfigs(filtered);
        } else {
            setFilteredConfigs(databaseConfigs);
        }
    }, [searchKeyword, databaseConfigs]);

    const loadDatabaseConfigs = async () => {
        try {
            const response = await databaseConfigApi.findAll();
            setDatabaseConfigs(response.data.data);
            setFilteredConfigs(response.data.data);
        } catch (error) {
            message.error('加载数据库配置失败');
        }
    };

    const handleDatabaseChange = async (value: number) => {
        setLoading(true);
        setDatabaseId(value);
        form.setFieldValue('tableName', undefined);
        setTableColumns([]);
        setPreviewData([]);
        setSearchText('');
        
        try {
            const response = await sqlExportApi.getTableNames(value);
            if (response.data.code === 200) {
                // 过滤，只保留指定的表
                const allowedTables = [
                    'sys_app_menu', 'sys_dict', 'sys_config', 
                    'imms_config', 'imms_dict', 
                    'qqdh_config', 'qqdh_dict'
                ];
                
                const filteredTables = response.data.data.filter(
                    table => allowedTables.includes(table)
                );
                
                setTables(filteredTables);
                message.success(`获取数据表成功，过滤后显示 ${filteredTables.length} 个表`);
            } else {
                message.error(`获取数据表失败: ${response.data.message}`);
                setTables([]);
            }
        } catch (error) {
            message.error('获取数据表失败');
            setTables([]);
        } finally {
            setLoading(false);
        }
    };

    const handleTableChange = async (tableName: string) => {
        try {
            setLoading(true);
            
            // 重置WHERE条件
            form.setFieldsValue({ whereClause: undefined });
            
            // 清空之前的数据
            setTableColumns([]);
            setPreviewData([]);
            
            console.log('====> 开始加载表结构和数据 <====');
            
            // 获取新的表结构
            const databaseConfigId = form.getFieldValue('databaseConfigId');
            console.log('获取表结构，数据库ID:', databaseConfigId, '表名:', tableName);
            
            // 打印完整的请求URL
            const tableStructureUrl = `/sql-export/columns/${databaseConfigId}/${tableName}`;
            console.log('表结构请求URL:', tableStructureUrl);
            
            const response = await sqlExportApi.getTableColumns(databaseConfigId, tableName);
            
            console.log('表结构响应状态:', response?.data?.code);
            console.log('表结构响应数据:', response?.data?.data);
            
            if (response?.data?.code === 200) {
                // 确保即使返回空数组也设置表结构
                // 将API返回的TableColumn转换为本地的TableColumn类型
                const columns = (response.data.data || []).map(col => ({
                    ...col,
                    columnComment: '' // 为API返回的列添加空的columnComment字段
                }));
                console.log('处理后的表结构:', columns);
                setTableColumns(columns);
                
                // 自动加载表数据（无筛选条件）
                const previewRequest: SqlExportRequest = {
                    databaseConfigId,
                    tableName,
                    limit: -1 // 移除数据限制，加载所有数据
                };
                
                console.log('预览数据请求参数:', previewRequest);
                const previewUrl = '/sql-export/preview';
                console.log('预览数据请求URL:', previewUrl);
                
                try {
                    const previewResponse = await sqlExportApi.previewData(previewRequest);
                    console.log('预览数据响应状态:', previewResponse?.data?.code);
                    console.log('预览数据响应消息:', previewResponse?.data?.message);
                    console.log('预览数据数量:', previewResponse?.data?.data?.length || 0);
                    
                    if (previewResponse?.data?.code === 200) {
                        // 确保数据是数组
                        const data = Array.isArray(previewResponse.data.data) 
                            ? previewResponse.data.data 
                            : [];
                        
                        console.log(`获取到 ${data.length} 条数据`);
                        if (data.length > 0) {
                            console.log('数据示例(第一条):', data[0]);
                        } else {
                            console.log('数据为空');
                        }
                        
                        setPreviewData(data);
                        
                        if (data.length > 0) {
                            message.success(`已加载 ${data.length} 条数据`);
                        } else {
                            message.info('当前表中没有数据');
                        }
                    } else {
                        console.error('获取表数据失败: ', previewResponse?.data?.message);
                        message.error('获取表数据失败: ' + (previewResponse?.data?.message || '未知错误'));
                        setPreviewData([]);
                    }
                } catch (previewError) {
                    console.error('加载表数据失败，详细错误:', previewError);
                    message.error('加载表数据失败，请检查网络和服务器状态');
                    setPreviewData([]);
                }
            } else {
                console.error('获取表结构失败: ', response?.data?.message);
                message.error('获取表结构失败: ' + (response?.data?.message || '未知错误'));
                // 确保设置为空数组
                setTableColumns([]);
                setPreviewData([]);
            }
        } catch (error: any) {
            console.error('加载表结构或数据失败:', error);
            if (error.response) {
                console.error('错误响应:', error.response);
                console.error('错误状态:', error.response.status);
                console.error('错误数据:', error.response.data);
            } else if (error.request) {
                console.error('请求未收到响应:', error.request);
            } else {
                console.error('错误消息:', error.message);
            }
            message.error('加载失败: ' + (error.response?.data?.message || error.message || '未知错误'));
            // 确保在出错时也设置为空数组
            setTableColumns([]);
            setPreviewData([]);
        } finally {
            console.log('====> 完成加载表结构和数据 <====');
            setLoading(false);
        }
    };

    // 当筛选条件变化时刷新数据
    const handleWhereClauseChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
        const value = e.target.value;
        if (!form.getFieldValue('tableName')) return;
        
        // 设置短暂延迟，避免频繁请求
        setTimeout(async () => {
            if (value !== form.getFieldValue('whereClause')) return;
            
            try {
                setLoading(true);
                const databaseConfigId = form.getFieldValue('databaseConfigId');
                const tableName = form.getFieldValue('tableName');
                
                console.log('应用筛选条件:', value || '(无筛选条件)');
                
                const request: SqlExportRequest = {
                    databaseConfigId,
                    tableName,
                    whereClause: value.trim(), // 去除前后空格
                    limit: -1 // 移除数据限制，加载所有数据
                };
                
                const response = await sqlExportApi.previewData(request);
                if (response.data.code === 200) {
                    const data = response.data.data || [];
                    setPreviewData(data);
                    
                    // 打印应用筛选条件后的记录数
                    console.log(`筛选后返回 ${data.length} 条记录`);
                    
                    // 有筛选条件但没有数据，给用户提示
                    if (value && data.length === 0) {
                        message.warning('没有符合条件的数据，请检查筛选条件');
                    }
                } else {
                    message.error('筛选数据失败: ' + response.data.message);
                }
            } catch (error: any) {
                console.error('筛选数据失败:', error);
                message.error('筛选失败: ' + (error.response?.data?.message || error.message || '未知错误'));
            } finally {
                setLoading(false);
            }
        }, 500);
    };

    const handlePreview = async () => {
        try {
            const values = await form.validateFields();
            setLoading(true);
            
            const request: SqlExportRequest = {
                databaseConfigId: values.databaseConfigId,
                tableName: values.tableName,
                whereClause: values.whereClause,
                limit: 10
            };
            
            const response = await sqlExportApi.previewData(request);
            if (response.data.code === 200) {
                setPreviewData(response.data.data);
            }
        } catch (error) {
            message.error('预览数据失败');
        } finally {
            setLoading(false);
        }
    };

    const handleExport = async () => {
        try {
            const formValues = form.getFieldsValue();
            if (!formValues.databaseConfigId || !formValues.tableName) {
                message.error('请选择数据库配置和数据表');
                return;
            }
            
            setLoading(true);
            
            // 使用当前表格中显示的数据进行导出，而不是使用WHERE条件
            if (previewData.length === 0) {
                message.warning('当前表格中没有数据可以导出');
                setLoading(false);
                return;
            }
            
            // 输出导出参数，帮助调试
            console.log('导出表格中当前显示的数据:', {
                databaseConfigId: formValues.databaseConfigId,
                tableName: formValues.tableName,
                recordCount: previewData.length
            });
            
            try {
                // 获取数据库配置信息
                const configResponse = await databaseConfigApi.findById(formValues.databaseConfigId);
                if (configResponse.data.code !== 200) {
                    throw new Error('获取数据库配置失败');
                }
                
                const dbConfig = configResponse.data.data;
                
                // 直接使用当前表格中的数据生成SQL
                let sql = `-- ================================================\n`;
                sql += `-- 数据导出文件 (表格搜索结果)\n`;
                sql += `-- ------------------------------------------------\n`;
                sql += `-- 导出表: ${formValues.tableName}\n`;
                sql += `-- 数据库: ${dbConfig.databaseName}\n`;
                sql += `-- 导出时间: ${new Date().toLocaleString()}\n`;
                sql += `-- 导出方式: 表格搜索结果\n`;
                sql += `-- 导出记录数: ${previewData.length}\n`;
                sql += `-- ================================================\n\n`;
                
                // 添加使用说明
                sql += `-- 使用说明:\n`;
                sql += `-- 1. 此文件包含SQL语句，可导入到MySQL数据库\n`;
                sql += `-- 2. 导入方法: 在MySQL中执行命令 source 文件路径.sql\n`;
                sql += `-- 3. 或在管理工具(如Navicat, phpMyAdmin等)中执行此SQL文件\n`;
                sql += `-- 4. 确保目标数据库存在${dbConfig.databaseName}库\n\n`;
                
                if (previewData.length > 0) {
                    // 添加分隔符并解释将要执行的操作
                    sql += `-- 开始插入数据到 ${dbConfig.databaseName}.${formValues.tableName} 表\n`;
                    sql += `-- 共${previewData.length}条记录\n\n`;
                    
                    previewData.forEach((row, index) => {
                        const columns = Object.keys(row);
                        
                        // 使用完全限定的表名（库名.表名）
                        sql += `INSERT INTO \`${dbConfig.databaseName}\`.\`${formValues.tableName}\` (${columns.map(c => '`' + c + '`').join(', ')}) VALUES (`;
                        
                        const escapeSql = (value: string): string => {
                            if (!value) return '';
                            return value.replace(/'/g, "''");
                        };
                        
                        const rowValues = columns.map(col => {
                            const value = row[col];
                            if (value === null) {
                                return 'NULL';
                            } else if (typeof value === 'number') {
                                return value;
                            } else {
                                return `'${escapeSql(String(value))}'`;
                            }
                        });
                        
                        sql += rowValues.join(', ');
                        sql += `);\n`;
                        
                        // 每50条记录添加一个分隔注释，提高可读性
                        if ((index + 1) % 50 === 0 && index < previewData.length - 1) {
                            sql += `\n-- 已导出${index + 1}条记录，继续...\n\n`;
                        }
                    });
                    
                    // 结束注释
                    sql += `\n-- 导出完成，共插入${previewData.length}条记录\n`;
                } else {
                    sql += `-- 未找到符合条件的数据\n`;
                }
                
                // 创建下载链接
                const blob = new Blob([sql], { type: 'text/plain' });
                const url = window.URL.createObjectURL(blob);
                const a = document.createElement('a');
                a.href = url;
                
                // 文件名包含MySQL标识
                a.download = `${formValues.tableName}_mysql_${new Date().getTime()}.sql`;
                
                document.body.appendChild(a);
                a.click();
                window.URL.revokeObjectURL(url);
                document.body.removeChild(a);
                
                message.success(`已导出表格中的 ${previewData.length} 条记录`);
            } catch (err: any) {
                console.error('生成SQL失败:', err);
                message.error('生成SQL失败: ' + (err.message || '未知错误'));
            }
        } catch (error: any) {
            console.error('导出失败:', error);
            message.error('导出失败: ' + (error.response?.data?.message || error.message || '未知错误'));
        } finally {
            setLoading(false);
        }
    };

    const handleExportPostgreSQL = async () => {
        try {
            const formValues = form.getFieldsValue();
            if (!formValues.databaseConfigId || !formValues.tableName) {
                message.error('请选择数据库配置和数据表');
                return;
            }
            
            setLoading(true);
            
            // 使用当前表格中显示的数据进行导出
            if (previewData.length === 0) {
                message.warning('当前表格中没有数据可以导出');
                setLoading(false);
                return;
            }
            
            try {
                // 获取数据库配置信息
                const configResponse = await databaseConfigApi.findById(formValues.databaseConfigId);
                if (configResponse.data.code !== 200) {
                    throw new Error('获取数据库配置失败');
                }
                
                const dbConfig = configResponse.data.data;
                
                // 生成MySQL SQL
                let sql = `-- ================================================\n`;
                sql += `-- 数据导出文件 (表格搜索结果)\n`;
                sql += `-- ------------------------------------------------\n`;
                sql += `-- 导出表: ${formValues.tableName}\n`;
                sql += `-- 数据库: ${dbConfig.databaseName}\n`;
                sql += `-- 导出时间: ${new Date().toLocaleString()}\n`;
                sql += `-- 导出方式: 表格搜索结果\n`;
                sql += `-- 导出记录数: ${previewData.length}\n`;
                sql += `-- ================================================\n\n`;
                
                // 添加国产数据库使用说明
                sql += `-- 国产数据库使用说明:\n`;
                sql += `-- 1. 此文件包含已转换为国产数据库格式的SQL语句\n`;
                sql += `-- 2. 导入方法: 请参考相应数据库导入文档\n`;
                sql += `-- 3. 或在各数据库管理工具中执行此SQL文件\n`;
                sql += `-- 4. 确保目标数据库已创建\n\n`;
                
                if (previewData.length > 0) {
                    // 添加分隔符并解释将要执行的操作
                    sql += `-- 开始插入数据到 ${dbConfig.databaseName}.${formValues.tableName} 表\n`;
                    sql += `-- 共${previewData.length}条记录\n\n`;
                    
                    previewData.forEach((row, index) => {
                        const columns = Object.keys(row);
                        
                        // 使用完全限定的表名（库名.表名），不使用引号
                        sql += `INSERT INTO ${dbConfig.databaseName}.${formValues.tableName} (${columns.map(c => c).join(', ')}) VALUES (`;
                        
                        const escapeSql = (value: string): string => {
                            if (!value) return '';
                            return value.replace(/'/g, "''");
                        };
                        
                        const rowValues = columns.map(col => {
                            const value = row[col];
                            if (value === null) {
                                return 'NULL';
                            } else if (typeof value === 'number') {
                                return value;
                            } else {
                                return `'${escapeSql(String(value))}'`;
                            }
                        });
                        
                        sql += rowValues.join(', ');
                        sql += `);\n`;
                        
                        // 每50条记录添加一个分隔注释，提高可读性
                        if ((index + 1) % 50 === 0 && index < previewData.length - 1) {
                            sql += `\n-- 已导出${index + 1}条记录，继续...\n\n`;
                        }
                    });
                    
                    // 结束注释
                    sql += `\n-- 导出完成，共插入${previewData.length}条记录\n`;
                } else {
                    sql += `-- 未找到符合条件的数据\n`;
                }
                
                // 转换为达梦格式
                const dmSql = convertToDM(sql);
                
                // 转换为瀚高格式
                const highgoSql = convertToHighgo(sql);
                
                // 创建并下载达梦SQL文件
                const dmBlob = new Blob([dmSql], { type: 'text/plain' });
                const dmUrl = window.URL.createObjectURL(dmBlob);
                const dmLink = document.createElement('a');
                dmLink.href = dmUrl;
                dmLink.download = `${formValues.tableName}_dameng_${new Date().getTime()}.sql`;
                document.body.appendChild(dmLink);
                dmLink.click();
                window.URL.revokeObjectURL(dmUrl);
                document.body.removeChild(dmLink);
                
                // 短暂延迟后下载瀚高SQL文件
                setTimeout(() => {
                    const highgoBlob = new Blob([highgoSql], { type: 'text/plain' });
                    const highgoUrl = window.URL.createObjectURL(highgoBlob);
                    const highgoLink = document.createElement('a');
                    highgoLink.href = highgoUrl;
                    highgoLink.download = `${formValues.tableName}_highgo_${new Date().getTime()}.sql`;
                    document.body.appendChild(highgoLink);
                    highgoLink.click();
                    window.URL.revokeObjectURL(highgoUrl);
                    document.body.removeChild(highgoLink);
                    
                    message.success(`已导出 ${previewData.length} 条记录并转换为瀚高和达梦格式`);
                }, 300);
                
            } catch (err: any) {
                console.error('生成国产数据库SQL失败:', err);
                message.error('生成国产数据库SQL失败: ' + (err.message || '未知错误'));
            }
        } catch (error: any) {
            console.error('导出失败:', error);
            message.error('导出失败: ' + (error.response?.data?.message || error.message || '未知错误'));
        } finally {
            setLoading(false);
        }
    };

    const handleSearch = (values: any) => {
        const { name, host, databaseName } = values;
        const filtered = databaseConfigs.filter(config => {
            const nameMatch = !name || config.name.toLowerCase().includes(name.toLowerCase());
            const hostMatch = !host || config.host.toLowerCase().includes(host.toLowerCase());
            const dbMatch = !databaseName || config.databaseName.toLowerCase().includes(databaseName.toLowerCase());
            return nameMatch && hostMatch && dbMatch;
        });
        setFilteredConfigs(filtered);
    };

    const getPreviewColumns = (): ColumnsType<any> => {
        // 如果没有预览数据但有表结构，使用表结构生成列
        if (!previewData.length && tableColumns.length) {
            return tableColumns.map(column => ({
                title: column.columnName,
                dataIndex: column.columnName,
                key: column.columnName,
                // 对于常见的ID字段，默认右对齐
                align: column.columnName && typeof column.columnName === 'string' && column.columnName.toLowerCase().includes('id') ? 'right' : 'left',
            }));
        }
        
        // 如果有预览数据，从数据中生成列
        if (previewData.length) {
            const firstRow = previewData[0];
            const columnNames = Object.keys(firstRow);
            
            return columnNames.map(columnName => ({
                title: columnName,
                dataIndex: columnName,
                key: columnName,
                sorter: (a, b) => {
                    // 数字类型排序
                    if (typeof a[columnName] === 'number' && typeof b[columnName] === 'number') {
                        return a[columnName] - b[columnName];
                    }
                    // 字符串类型排序
                    if (a[columnName] && b[columnName]) {
                        return a[columnName].toString().localeCompare(b[columnName].toString());
                    }
                    // 处理 null/undefined 值
                    if (a[columnName] === null || a[columnName] === undefined) return -1;
                    if (b[columnName] === null || b[columnName] === undefined) return 1;
                    return 0;
                },
                // 对于常见的ID字段，默认右对齐
                align: columnName && typeof columnName === 'string' && columnName.toLowerCase().includes('id') ? 'right' : 'left',
            }));
        }
        
        // 如果既没有预览数据也没有表结构，返回空数组
        return [];
    };

    const getConfigColumns = (): ColumnsType<DatabaseConfig> => [
        {
            title: '名称',
            dataIndex: 'name',
            key: 'name',
        },
        {
            title: '主机',
            dataIndex: 'host',
            key: 'host',
        },
        {
            title: '端口',
            dataIndex: 'port',
            key: 'port',
        },
        {
            title: '数据库名',
            dataIndex: 'databaseName',
            key: 'databaseName',
        },
        {
            title: '用户名',
            dataIndex: 'username',
            key: 'username',
        },
        {
            title: '备注',
            dataIndex: 'remark',
            key: 'remark',
        },
        {
            title: '操作',
            key: 'action',
            render: (_, record) => (
                <Button type="link" onClick={() => handleExportConfig(record.id)}>
                    导出SQL
                </Button>
            ),
        },
    ];

    const handleExportConfig = async (id: number) => {
        try {
            setLoading(true);
            
            // 使用专门的方法导出数据库配置
            const response = await sqlExportApi.exportConfigSql(id);
            
            if (response.data.code === 200) {
                // 创建下载链接
                const sqlString = response.data.data;
                const blob = new Blob([sqlString], { type: 'text/plain' });
                const url = window.URL.createObjectURL(blob);
                const a = document.createElement('a');
                a.href = url;
                a.download = `database_config_${id}.sql`;
                document.body.appendChild(a);
                a.click();
                window.URL.revokeObjectURL(url);
                document.body.removeChild(a);
                
                message.success('导出成功');
            }
        } catch (error: any) {
            console.error('导出失败:', error);
            message.error('导出失败: ' + (error.response?.data?.message || error.message || '未知错误'));
        } finally {
            setLoading(false);
        }
    };

    // 测试所有API接口
    const testApis = async () => {
        if (!databaseConfigs.length) {
            message.error('没有可用的数据库配置');
            return;
        }
        
        const testId = databaseConfigs[0].id;
        
        try {
            message.info('开始测试接口');
            
            // 测试获取表名列表
            console.log('测试获取表名列表...');
            const tablesResponse = await sqlExportApi.getTableNames(testId);
            console.log('表名列表结果:', tablesResponse);
            
            if (tablesResponse.data.code === 200 && tablesResponse.data.data.length > 0) {
                const testTable = tablesResponse.data.data[0];
                
                // 测试获取表结构
                console.log('测试获取表结构...');
                const columnsResponse = await sqlExportApi.getTableColumns(testId, testTable);
                console.log('表结构结果:', columnsResponse);
                
                // 测试预览数据
                console.log('测试预览数据...');
                const previewResponse = await sqlExportApi.previewData({
                    databaseConfigId: testId,
                    tableName: testTable,
                    limit: 5
                });
                console.log('预览数据结果:', previewResponse);
                
                // 测试导出SQL
                console.log('测试导出SQL...');
                const exportResponse = await sqlExportApi.exportSql(testId, testTable);
                console.log('导出SQL结果:', exportResponse);
            }
            
            message.success('测试完成，请查看控制台');
        } catch (error: any) {
            console.error('测试失败:', error);
            message.error('测试失败: ' + (error.response?.data?.message || error.message || '未知错误'));
        }
    };

    // 在组件挂载时初始化表单
    useEffect(() => {
        form.resetFields();
        setTables([]);
        setTableColumns([]);
        setPreviewData([]);
    }, [form]);

    // 添加手动SQL转换相关方法
    const handleManualSqlChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
        setManualSql(e.target.value);
    };

    const handleConvertSql = () => {
        if (!manualSql.trim()) {
            message.error('请输入SQL语句');
            return;
        }
        
        setConvertLoading(true);
        
        try {
            // 转换为达梦格式
            let dmSql = convertToDM(manualSql);
            
            // 转换为瀚高格式
            let highgoSql = convertToHighgo(manualSql);
            
            // 额外清理操作，确保预览显示正确
            // 移除可能存在的多余注释或文本
            dmSql = dmSql.replace(/COMMENT ON (TABLE|COLUMN).*?['"]\s*;?\s*这个是你.*?$/gm, (match) => {
                const endIndex = match.indexOf("'") + 1;
                return match.substring(0, endIndex) + ";";
            });
            
            highgoSql = highgoSql.replace(/COMMENT ON (TABLE|COLUMN).*?['"]\s*;?\s*这个是你.*?$/gm, (match) => {
                const endIndex = match.indexOf("'") + 1;
                return match.substring(0, endIndex) + ";";
            });
            
            // 移除独立的无意义注释行
            dmSql = dmSql.replace(/^这个是你.*?\n/gm, '');
            highgoSql = highgoSql.replace(/^这个是你.*?\n/gm, '');
            
            // 移除错误的行尾分号，只保留语句结尾的分号
            // 这里不应该在每行结尾添加分号，而只应该在完整语句结束时添加
            dmSql = dmSql.replace(/;[\r\n]/g, '\n');
            highgoSql = highgoSql.replace(/;[\r\n]/g, '\n');
            
            // 确保SQL语句正确结束
            dmSql = dmSql.replace(/CREATE TABLE[\s\S]*?\)/g, match => match + ';');
            highgoSql = highgoSql.replace(/CREATE TABLE[\s\S]*?\)/g, match => match + ';');
            
            // 确保注释语句正确结束
            dmSql = dmSql.replace(/COMMENT ON[\s\S]*?'/g, match => match + ';');
            highgoSql = highgoSql.replace(/COMMENT ON[\s\S]*?'/g, match => match + ';');
            
            // 最后再次检查，去除可能连续出现的多个分号
            dmSql = dmSql.replace(/;;+/g, ';');
            highgoSql = highgoSql.replace(/;;+/g, ';');
            
            // 创建并下载达梦SQL文件
            const dmBlob = new Blob([dmSql], { type: 'text/plain' });
            const dmUrl = window.URL.createObjectURL(dmBlob);
            const dmLink = document.createElement('a');
            dmLink.href = dmUrl;
            dmLink.download = `mysql_to_dameng_${new Date().getTime()}.sql`;
            document.body.appendChild(dmLink);
            dmLink.click();
            window.URL.revokeObjectURL(dmUrl);
            document.body.removeChild(dmLink);
            
            // 短暂延迟后下载瀚高SQL文件
            setTimeout(() => {
                const highgoBlob = new Blob([highgoSql], { type: 'text/plain' });
                const highgoUrl = window.URL.createObjectURL(highgoBlob);
                const highgoLink = document.createElement('a');
                highgoLink.href = highgoUrl;
                highgoLink.download = `mysql_to_highgo_${new Date().getTime()}.sql`;
                document.body.appendChild(highgoLink);
                highgoLink.click();
                window.URL.revokeObjectURL(highgoUrl);
                document.body.removeChild(highgoLink);
                
                message.success('SQL语句已转换并下载');
                setSqlConvertModalVisible(false);
                setManualSql('');
            }, 300);
        } catch (error: any) {
            console.error('转换SQL失败:', error);
            message.error('转换SQL失败: ' + (error.message || '未知错误'));
        } finally {
            setConvertLoading(false);
        }
    };

    // 使用示例SQL
    const useExampleSql = () => {
        setManualSql(exampleSql);
        message.info('已加载示例SQL，您可以修改后点击转换按钮');
    };

    // 预览转换结果但不下载
    const handlePreviewConvertSql = () => {
        if (!manualSql.trim()) {
            message.error('请输入SQL语句');
            return;
        }
        
        setConvertLoading(true);
        
        try {
            // 转换为达梦格式
            let dmSql = convertToDM(manualSql);
            
            // 转换为瀚高格式
            let highgoSql = convertToHighgo(manualSql);
            
            // 设置预览内容
            setPreviewDmSql(dmSql);
            setPreviewHighgoSql(highgoSql);
            
            // 显示预览弹窗
            setPreviewConvertVisible(true);
            setActivePreviewTab('highgo'); // 默认显示瀚高标签，因为用户更关注这个
            
            message.success('SQL转换成功，请查看预览');
        } catch (error: any) {
            console.error('转换SQL失败:', error);
            message.error('转换SQL失败: ' + (error.message || '未知错误'));
        } finally {
            setConvertLoading(false);
        }
    };

    // 关闭预览转换结果
    const handleClosePreview = () => {
        setPreviewConvertVisible(false);
    };

    // 处理分页变化的函数
    const handlePaginationChange = (page: number, pageSize?: number) => {
        console.log('分页变化:', page, pageSize);
        setPagination({
            current: page,
            pageSize: pageSize || pagination.pageSize
        });
    };

    // 处理页面大小变化
    const handlePageSizeChange = (current: number, size: number) => {
        console.log('页面大小变化:', current, size);
        setPagination({
            current: current,
            pageSize: size
        });
    };

    // 生成更加稳定的行键
    function generateStableRowKey(record: any, index: number): string {
        // 如果记录有唯一的ID，优先使用
        if (record && record.id) {
            return `id-${record.id}`;
        }
        
        // 没有ID字段，尝试使用其他唯一标识字段
        // 这里列出一些常见的标识字段
        const possibleKeyFields = [
            'uid', 'uuid', 'key', 'code', 'no', 'number', 'serial', 
            'identity', 'name', 'username', 'email'
        ];
        
        for (const field of possibleKeyFields) {
            if (record && record[field]) {
                return `${field}-${record[field]}`;
            }
        }
        
        // 如果没有找到合适的字段，使用行的索引和内容哈希组合
        const contentHash = JSON.stringify(record).split('').reduce((a, b) => {
            a = (a << 5) - a + b.charCodeAt(0);
            return a & a;
        }, 0);
        
        return `row-${index}-${Math.abs(contentHash)}`;
    }

    // 处理选择行变化
    const handleRowSelectionChange = (selectedKeys: React.Key[], selectedItems: any[]) => {
        setSelectedRowKeys(selectedKeys);
        setSelectedRows(selectedItems);
        console.log('已选择行数:', selectedKeys.length);
    };

    // 导出选中的行
    const handleExportSelected = async () => {
        if (selectedRows.length === 0) {
            message.warning('请至少选择一条记录进行导出');
            return;
        }
        
        try {
            const formValues = form.getFieldsValue();
            if (!formValues.databaseConfigId || !formValues.tableName) {
                message.error('请选择数据库配置和数据表');
                return;
            }
            
            setLoading(true);
            
            try {
                // 获取数据库配置信息
                const configResponse = await databaseConfigApi.findById(formValues.databaseConfigId);
                if (configResponse.data.code !== 200) {
                    throw new Error('获取数据库配置失败');
                }
                
                const dbConfig = configResponse.data.data;
                
                // 使用选中的行生成SQL
                let sql = `-- ================================================\n`;
                sql += `-- 数据导出文件 (已选择${selectedRows.length}条记录)\n`;
                sql += `-- ------------------------------------------------\n`;
                sql += `-- 导出表: ${formValues.tableName}\n`;
                sql += `-- 数据库: ${dbConfig.databaseName}\n`;
                sql += `-- 导出时间: ${new Date().toLocaleString()}\n`;
                sql += `-- 导出方式: 已选择的${selectedRows.length}条记录\n`;
                sql += `-- ================================================\n\n`;
                
                // 添加使用说明
                sql += `-- 使用说明:\n`;
                sql += `-- 1. 此文件包含SQL语句，可导入到MySQL数据库\n`;
                sql += `-- 2. 导入方法: 在MySQL中执行命令 source 文件路径.sql\n`;
                sql += `-- 3. 或在管理工具(如Navicat, phpMyAdmin等)中执行此SQL文件\n`;
                sql += `-- 4. 确保目标数据库存在${dbConfig.databaseName}库\n\n`;
                
                if (selectedRows.length > 0) {
                    // 添加分隔符并解释将要执行的操作
                    sql += `-- 开始插入数据到 ${dbConfig.databaseName}.${formValues.tableName} 表\n`;
                    sql += `-- 共${selectedRows.length}条记录\n\n`;
                    
                    selectedRows.forEach((row, index) => {
                        const columns = Object.keys(row);
                        
                        // 使用完全限定的表名（库名.表名）
                        sql += `INSERT INTO \`${dbConfig.databaseName}\`.\`${formValues.tableName}\` (${columns.map(c => '`' + c + '`').join(', ')}) VALUES (`;
                        
                        const escapeSql = (value: string): string => {
                            if (!value) return '';
                            return value.replace(/'/g, "''");
                        };
                        
                        const rowValues = columns.map(col => {
                            const value = row[col];
                            if (value === null) {
                                return 'NULL';
                            } else if (typeof value === 'number') {
                                return value;
                            } else {
                                return `'${escapeSql(String(value))}'`;
                            }
                        });
                        
                        sql += rowValues.join(', ');
                        sql += `);\n`;
                        
                        // 每50条记录添加一个分隔注释，提高可读性
                        if ((index + 1) % 50 === 0 && index < selectedRows.length - 1) {
                            sql += `\n-- 已导出${index + 1}条记录，继续...\n\n`;
                        }
                    });
                    
                    // 结束注释
                    sql += `\n-- 导出完成，共插入${selectedRows.length}条记录\n`;
                } else {
                    sql += `-- 未选择任何记录\n`;
                }
                
                // 创建下载链接
                const blob = new Blob([sql], { type: 'text/plain' });
                const url = window.URL.createObjectURL(blob);
                const a = document.createElement('a');
                a.href = url;
                
                // 文件名包含选择标识
                a.download = `${formValues.tableName}_selected_${selectedRows.length}_records_${new Date().getTime()}.sql`;
                
                document.body.appendChild(a);
                a.click();
                window.URL.revokeObjectURL(url);
                document.body.removeChild(a);
                
                message.success(`已导出 ${selectedRows.length} 条选中记录`);
            } catch (err: any) {
                console.error('生成SQL失败:', err);
                message.error('生成SQL失败: ' + (err.message || '未知错误'));
            }
        } catch (error: any) {
            console.error('导出失败:', error);
            message.error('导出失败: ' + (error.response?.data?.message || error.message || '未知错误'));
        } finally {
            setLoading(false);
        }
    };

    // 导出选中行到国产数据库格式
    const handleExportSelectedToNativeDb = async () => {
        if (selectedRows.length === 0) {
            message.warning('请至少选择一条记录进行导出');
            return;
        }
        
        try {
            const formValues = form.getFieldsValue();
            if (!formValues.databaseConfigId || !formValues.tableName) {
                message.error('请选择数据库配置和数据表');
                return;
            }
            
            setLoading(true);
            
            try {
                // 获取数据库配置信息
                const configResponse = await databaseConfigApi.findById(formValues.databaseConfigId);
                if (configResponse.data.code !== 200) {
                    throw new Error('获取数据库配置失败');
                }
                
                const dbConfig = configResponse.data.data;
                
                // 使用选中的行生成MySQL SQL
                let mysqlSql = `-- ================================================\n`;
                mysqlSql += `-- 数据导出文件 (已选择${selectedRows.length}条记录)\n`;
                mysqlSql += `-- ------------------------------------------------\n`;
                mysqlSql += `-- 导出表: ${formValues.tableName}\n`;
                mysqlSql += `-- 数据库: ${dbConfig.databaseName}\n`;
                mysqlSql += `-- 导出时间: ${new Date().toLocaleString()}\n`;
                mysqlSql += `-- 导出方式: 已选择的${selectedRows.length}条记录\n`;
                mysqlSql += `-- ================================================\n\n`;
                
                // 添加国产数据库使用说明
                mysqlSql += `-- 国产数据库使用说明:\n`;
                mysqlSql += `-- 1. 此文件已转换为国产数据库格式\n`;
                mysqlSql += `-- 2. 支持达梦和瀚高数据库\n`;
                mysqlSql += `-- 3. 导入方法: 请参考相应数据库导入文档\n`;
                mysqlSql += `-- 4. 确保目标表结构已经创建\n\n`;
                
                if (selectedRows.length > 0) {
                    // 添加分隔符并解释将要执行的操作
                    mysqlSql += `-- 开始插入数据到 ${dbConfig.databaseName}.${formValues.tableName} 表\n`;
                    mysqlSql += `-- 共${selectedRows.length}条记录\n\n`;
                    
                    selectedRows.forEach((row, index) => {
                        const columns = Object.keys(row);
                        
                        // 使用MySQL格式，后面会转换成国产数据库格式
                        mysqlSql += `INSERT INTO \`${dbConfig.databaseName}\`.\`${formValues.tableName}\` (${columns.map(c => '`' + c + '`').join(', ')}) VALUES (`;
                        
                        const escapeSql = (value: string): string => {
                            if (!value) return '';
                            return value.replace(/'/g, "''");
                        };
                        
                        const rowValues = columns.map(col => {
                            const value = row[col];
                            if (value === null) {
                                return 'NULL';
                            } else if (typeof value === 'number') {
                                return value;
                            } else {
                                return `'${escapeSql(String(value))}'`;
                            }
                        });
                        
                        mysqlSql += rowValues.join(', ');
                        mysqlSql += `);\n`;
                        
                        // 每50条记录添加一个分隔注释，提高可读性
                        if ((index + 1) % 50 === 0 && index < selectedRows.length - 1) {
                            mysqlSql += `\n-- 已导出${index + 1}条记录，继续...\n\n`;
                        }
                    });
                    
                    // 结束注释
                    mysqlSql += `\n-- 导出完成，共插入${selectedRows.length}条记录\n`;
                    
                    // 转换为达梦和瀚高格式
                    const dmSql = convertToDM(mysqlSql);
                    const highgoSql = convertToHighgo(mysqlSql);
                    
                    // 创建并下载达梦SQL文件
                    const dmBlob = new Blob([dmSql], { type: 'text/plain' });
                    const dmUrl = window.URL.createObjectURL(dmBlob);
                    const dmLink = document.createElement('a');
                    dmLink.href = dmUrl;
                    dmLink.download = `${formValues.tableName}_selected_${selectedRows.length}_dameng_${new Date().getTime()}.sql`;
                    document.body.appendChild(dmLink);
                    dmLink.click();
                    window.URL.revokeObjectURL(dmUrl);
                    document.body.removeChild(dmLink);
                    
                    // 短暂延迟后下载瀚高SQL文件
                    setTimeout(() => {
                        const highgoBlob = new Blob([highgoSql], { type: 'text/plain' });
                        const highgoUrl = window.URL.createObjectURL(highgoBlob);
                        const highgoLink = document.createElement('a');
                        highgoLink.href = highgoUrl;
                        highgoLink.download = `${formValues.tableName}_selected_${selectedRows.length}_highgo_${new Date().getTime()}.sql`;
                        document.body.appendChild(highgoLink);
                        highgoLink.click();
                        window.URL.revokeObjectURL(highgoUrl);
                        document.body.removeChild(highgoLink);
                        
                        message.success(`已导出 ${selectedRows.length} 条选中记录为国产数据库格式`);
                    }, 300);
                } else {
                    message.warning('未选择任何记录');
                }
            } catch (err: any) {
                console.error('生成国产数据库SQL失败:', err);
                message.error('生成国产数据库SQL失败: ' + (err.message || '未知错误'));
            }
        } catch (error: any) {
            console.error('导出失败:', error);
            message.error('导出失败: ' + (error.response?.data?.message || error.message || '未知错误'));
        } finally {
            setLoading(false);
        }
    };

    return (
        <div style={{ padding: 24 }}>
            <Card title="SQL导出配置" style={{ marginBottom: 24 }}>
                {/* 添加SQL转换按钮 */}
                <div style={{ marginBottom: 16, textAlign: 'right' }}>
                    <Button 
                        type="primary" 
                        onClick={() => setSqlConvertModalVisible(true)}
                        icon={<FileOutlined />}
                    >
                        手动转换SQL语句
                    </Button>
                </div>
                
                <Alert
                    type="success"
                    message="已过滤系统表"
                    description={
                        <span>
                            系统已严格筛选，仅显示以下允许的表: <Tag color="blue">sys_app_menu</Tag>、
                            <Tag color="blue">sys_dict</Tag>、
                            <Tag color="blue">sys_config</Tag>、
                            <Tag color="green">imms_config</Tag>、
                            <Tag color="green">imms_dict</Tag>、
                            <Tag color="purple">qqdh_config</Tag>、
                            <Tag color="purple">qqdh_dict</Tag>
                            {tables.length > 0 && (
                                <span>
                                    {' '}当前共有 <strong>{tables.length}</strong> 个表符合条件，其中
                                    菜单表 {tables.filter(t => t.toLowerCase().includes('menu')).length} 个，
                                    字典表 {tables.filter(t => t.toLowerCase().includes('dict')).length} 个，
                                    配置表 {tables.filter(t => t.toLowerCase().includes('config')).length} 个。
                                </span>
                            )}
                        </span>
                    }
                    showIcon
                    style={{ marginBottom: 16 }}
                />
                <Form form={form} layout="vertical">
                    <Row gutter={16}>
                        <Col span={12}>
                            <Form.Item
                                name="databaseConfigId"
                                label="数据库配置"
                                tooltip="选择要从哪个数据库导出数据"
                                rules={[{ required: true, message: '请选择数据库配置' }]}
                            >
                                <Select
                                    placeholder="请选择要导出数据的数据库"
                                    onChange={handleDatabaseChange}
                                    optionLabelProp="label"
                                >
                                    {filteredConfigs.map(config => (
                                        <Option 
                                            key={config.id} 
                                            value={config.id}
                                            label={`${config.name} (${config.host}:${config.port}/${config.databaseName})`}
                                        >
                                            <div style={{ display: 'flex', flexDirection: 'column' }}>
                                                <span>
                                                    {config.name} ({config.host}:{config.port}/{config.databaseName})
                                                </span>
                                                {config.remark && (
                                                    <span style={{ color: '#999', fontSize: '12px' }}>
                                                        备注: {config.remark}
                                                    </span>
                                                )}
                                            </div>
                                        </Option>
                                    ))}
                                </Select>
                            </Form.Item>
                        </Col>
                        <Col span={12}>
                            <Form.Item
                                name="tableName"
                                label="数据表"
                                tooltip="系统已筛选出指定表：sys_app_menu、sys_dict、sys_config、imms_config、imms_dict、qqdh_config、qqdh_dict"
                                rules={[{ required: true, message: '请选择数据表' }]}
                            >
                                <Select 
                                    placeholder="请选择要导出的数据表"
                                    onChange={handleTableChange}
                                    showSearch
                                    optionFilterProp="children"
                                    filterOption={(input, option) => {
                                        if (!option || !option.children) return false;
                                        return option.children.toString().toLowerCase().includes(input.toLowerCase());
                                    }}
                                >
                                    {/* 分组显示表 */}
                                    <Select.OptGroup label="菜单表">
                                        {tables.filter(table => table.toLowerCase().includes('menu')).map(table => (
                                            <Option key={table} value={table}>
                                                {table}
                                            </Option>
                                        ))}
                                    </Select.OptGroup>
                                    <Select.OptGroup label="字典表">
                                        {tables.filter(table => table.toLowerCase().includes('dict')).map(table => (
                                            <Option key={table} value={table}>
                                                {table}
                                            </Option>
                                        ))}
                                    </Select.OptGroup>
                                    <Select.OptGroup label="配置表">
                                        {tables.filter(table => table.toLowerCase().includes('config')).map(table => (
                                            <Option key={table} value={table}>
                                                {table}
                                            </Option>
                                        ))}
                                    </Select.OptGroup>
                                </Select>
                            </Form.Item>
                        </Col>
                    </Row>
                </Form>
                
                {/* 过滤信息提示 */}
                {tables.length > 0 && databaseId && (
                    <Card style={{ marginBottom: 16 }}>
                        <Alert
                            type="info"
                            showIcon
                            message={
                                <div>
                                    系统已按要求筛选表，共显示 <Tag color="blue">{tables.length}</Tag> 个表：
                                    <div style={{ marginTop: 8 }}>
                                        <Tag color="cyan">菜单表({tables.filter(table => table.toLowerCase().includes('menu')).length}个)</Tag>
                                        <Tag color="green">字典表({tables.filter(table => table.toLowerCase().includes('dict')).length}个)</Tag>
                                        <Tag color="orange">配置表({tables.filter(table => table.toLowerCase().includes('config')).length}个)</Tag>
                                    </div>
                                </div>
                            }
                        />
                    </Card>
                )}
                
                {form.getFieldValue('tableName') && (
                    <>
                        <Card 
                            title={
                                <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
                                    <span>
                                        数据预览 ({previewData.length}条记录)
                                        {loading && <Tag color="blue" style={{ marginLeft: 8 }}>数据加载中...</Tag>}
                                        {selectedRowKeys.length > 0 && (
                                            <Tag color="green" style={{ marginLeft: 8 }}>
                                                已选择 {selectedRowKeys.length} 条记录
                                            </Tag>
                                        )}
                                    </span>
                                    <Space>
                                        <Button 
                                            type="primary" 
                                            onClick={selectedRowKeys.length > 0 ? handleExportSelected : handleExport}
                                            loading={loading}
                                            icon={<DownloadOutlined />}
                                            title={selectedRowKeys.length > 0 ? `导出已选择的${selectedRowKeys.length}条记录` : `导出当前表格中显示的所有数据`}
                                        >
                                            {selectedRowKeys.length > 0 ? `导出选中的${selectedRowKeys.length}条记录` : '导出MySQL'}
                                        </Button>
                                        <Button 
                                            onClick={selectedRowKeys.length > 0 ? handleExportSelectedToNativeDb : handleExportPostgreSQL}
                                            loading={loading}
                                            icon={<FileOutlined />}
                                            title={selectedRowKeys.length > 0 ? `导出选中的${selectedRowKeys.length}条记录到国产数据库` : `导出当前表格中显示的所有数据并转换为瀚高和达梦数据库格式`}
                                        >
                                            {selectedRowKeys.length > 0 ? `导出选中到国产数据库` : '导出国产数据库'}
                                        </Button>
                                    </Space>
                                </div>
                            }
                            type="inner"
                            style={{ marginTop: 16 }}
                        >
                            
                            {/* 修改数据加载与导出说明 */}
                            <Alert
                                message="数据加载与导出说明"
                                description={
                                    <div>
                                        <p>• 系统加载表中所有数据，没有数量限制</p>
                                        <p>• 勾选数据行可以选择性导出特定记录</p>
                                        <p>• 使用下方搜索框筛选数据，可以更精确地查找所需记录</p>
                                        <p>• 导出功能会包含表中<strong>所有</strong>符合条件的数据</p>
                                        <p>• 通过表格分页器可以方便地浏览所有加载的数据</p>
                                    </div>
                                }
                                type="info"
                                showIcon
                                style={{ marginBottom: 16 }}
                            />
                            
                            {/* 移除WHERE条件输入框，改为强调表格搜索功能 */}
                            <Alert
                                message="搜索导出功能说明"
                                description="在下方搜索框中输入关键字可以在表格中过滤数据，然后点击'导出表格数据'按钮可以直接导出搜索结果。"
                                type="info"
                                showIcon
                                style={{ marginBottom: 16 }}
                            />
                            
                            <div style={{ marginBottom: 16, display: 'flex', justifyContent: 'space-between' }}>
                                <Input.Search
                                    placeholder="在表格中搜索(支持所有字段)..."
                                    style={{ width: 400 }}
                                    allowClear
                                    enterButton="搜索"
                                    onSearch={(value) => {
                                        // 去除输入中的空格
                                        const trimmedValue = value.trim();
                                        
                                        // 如果搜索值为空，重新加载原始数据
                                        if (!trimmedValue) {
                                            // 如果搜索值为空，重新加载原始数据
                                            const databaseConfigId = form.getFieldValue('databaseConfigId');
                                            const tableName = form.getFieldValue('tableName');
                                            
                                            // 重新加载所有数据
                                            setLoading(true);
                                            sqlExportApi.previewData({
                                                databaseConfigId,
                                                tableName,
                                                limit: 1000
                                            }).then(response => {
                                                if (response.data.code === 200) {
                                                    setPreviewData(response.data.data || []);
                                                }
                                                setLoading(false);
                                            }).catch(() => {
                                                setLoading(false);
                                            });
                                            return;
                                        }
                                        
                                        setLoading(true);
                                        // 在当前数据中搜索
                                        try {
                                            const searchText = trimmedValue.toLowerCase();
                                            const allData = previewData;
                                            const filtered = allData.filter(row => {
                                                // 搜索所有字段
                                                return Object.values(row).some(val => {
                                                    // 如果值为null或undefined，跳过
                                                    if (val === null || val === undefined) return false;
                                                    
                                                    // 转为字符串并去除空格
                                                    const strVal = val.toString().trim().toLowerCase();
                                                    
                                                    // 跳过空字符串
                                                    if (strVal === '') return false;
                                                    
                                                    return strVal.includes(searchText);
                                                });
                                            });
                                            
                                            // 更新显示数据
                                            setPreviewData(filtered);
                                            
                                            // 提示用户搜索结果
                                            message.success(`找到 ${filtered.length} 条匹配记录，可直接导出搜索结果`);
                                        } catch (err) {
                                            message.error('搜索过程中出现错误');
                                        } finally {
                                            setLoading(false);
                                        }
                                    }}
                                />
                                
                                <div>
                                    <span style={{ marginRight: 16 }}>
                                        表名: <Tag color="blue">{form.getFieldValue('tableName')}</Tag>
                                    </span>
                                    <span>
                                        列数: <Tag color="purple">{tableColumns.length}</Tag>
                                    </span>
                                </div>
                            </div>
                            
                            <Table
                                dataSource={previewData}
                                columns={getPreviewColumns()}
                                rowKey={(record, index) => generateStableRowKey(record, index ?? 0)} // 使用生成的稳定行键
                                rowSelection={{
                                    type: 'checkbox',
                                    selectedRowKeys,
                                    onChange: (selectedKeys, selectedItems) => {
                                        // 确保选中的行有效
                                        console.log('选中的键:', selectedKeys);
                                        console.log('选中的行:', selectedItems);
                                        setSelectedRowKeys(selectedKeys);
                                        setSelectedRows(selectedItems);
                                    },
                                    getCheckboxProps: (record) => ({
                                        // 不禁用任何行的选择
                                        disabled: false,
                                        // 使用自定义生成的行键作为复选框的名称
                                        name: generateStableRowKey(record, previewData.indexOf(record)), 
                                    }),
                                    // 简化选择功能，避免复杂的筛选逻辑可能引起的问题
                                    selections: [
                                        Table.SELECTION_ALL,
                                        Table.SELECTION_INVERT,
                                        Table.SELECTION_NONE,
                                    ],
                                }}
                                pagination={{ 
                                    current: pagination.current,
                                    pageSize: pagination.pageSize,
                                    showSizeChanger: true,
                                    pageSizeOptions: ['10', '20', '50', '100', '200', '500', '1000'],
                                    showTotal: total => `共 ${total} 条记录`,
                                    onChange: handlePaginationChange,
                                    onShowSizeChange: handlePageSizeChange
                                }}
                                size="middle"
                                bordered
                                scroll={{ x: 'max-content' }}
                                loading={loading}
                                locale={{
                                    emptyText: (
                                        <div style={{ padding: '20px 0' }}>
                                            <p>暂无数据</p>
                                            <p>可能原因: 表为空、筛选条件无匹配数据、表结构获取失败</p>
                                            <p>即使没有表数据，您仍然可以导出表结构的SQL语句</p>
                                            <Button 
                                                type="primary" 
                                                onClick={handleExport}
                                                style={{ marginTop: 16 }}
                                            >
                                                仍然导出SQL
                                            </Button>
                                        </div>
                                    )
                                }}
                            />
                        </Card>
                            
                        <Alert
                            style={{ marginTop: 16 }}
                            message="导出说明"
                            description={
                                <ul>
                                    <li>上方表格显示数据库中的记录，最多显示100条</li>
                                    <li>使用搜索框可以快速筛选表格中的数据，支持搜索所有字段</li>
                                    <li>点击"导出MySQL"按钮将导出当前表格中的数据为MySQL格式</li>
                                    <li>点击"导出国产数据库"按钮将同时下载瀚高和达梦兼容格式</li>
                                    <li>导出的文件将包含INSERT语句，可以直接导入到相同结构的数据库中</li>
                                    <li>支持排序功能，点击列标题可以按照该列进行排序后再导出</li>
                                </ul>
                            }
                            type="info"
                            showIcon
                        />
                    </>
                )}
            </Card>
            
            {/* 手动SQL转换Modal */}
            <Modal
                title="手动转换MySQL语句"
                open={sqlConvertModalVisible}
                onCancel={() => setSqlConvertModalVisible(false)}
                footer={[
                    <Button key="example" onClick={useExampleSql}>
                        使用示例SQL
                    </Button>,
                    <Button key="preview" onClick={handlePreviewConvertSql} disabled={!manualSql.trim()}>
                        预览转换结果
                    </Button>,
                    <Button key="cancel" onClick={() => setSqlConvertModalVisible(false)}>
                        取消
                    </Button>,
                    <Button 
                        key="convert" 
                        type="primary" 
                        onClick={handleConvertSql}
                        loading={convertLoading}
                        disabled={!manualSql.trim()}
                    >
                        转换并下载
                    </Button>
                ]}
                width={800}
            >
                <Alert
                    message="使用说明"
                    description={
                        <ul>
                            <li>请在下方输入框中粘贴MySQL语句</li>
                            <li>点击「转换并下载」按钮将自动转换为达梦和瀚高数据库语法</li>
                            <li>系统将自动下载两个文件，分别包含转换后的达梦和瀚高SQL</li>
                            <li>支持INSERT、CREATE TABLE等常见MySQL语句的转换</li>
                        </ul>
                    }
                    type="info"
                    showIcon
                    style={{ marginBottom: 16 }}
                />
                
                <TextArea
                    placeholder="请在此处输入或粘贴MySQL语句..."
                    value={manualSql}
                    onChange={handleManualSqlChange}
                    rows={12}
                    style={{ fontFamily: 'monospace' }}
                />
                
                <div style={{ marginTop: 16 }}>
                    <Typography.Text type="secondary">
                        提示: 点击"使用示例SQL"按钮可以快速填充常见的MySQL建表和插入语句。
                    </Typography.Text>
                </div>
            </Modal>
            
            {/* 预览转换结果Modal */}
            <Modal
                title="SQL转换结果预览"
                open={previewConvertVisible}
                onCancel={handleClosePreview}
                footer={[
                    <Button 
                        key="download" 
                        type="primary" 
                        onClick={handleConvertSql}
                    >
                        下载转换结果
                    </Button>,
                    <Button key="close" onClick={handleClosePreview}>
                        关闭
                    </Button>
                ]}
                width={900}
            >
                <Tabs
                    activeKey={activePreviewTab}
                    onChange={setActivePreviewTab}
                    items={[
                        {
                            key: 'dm',
                            label: '达梦数据库SQL',
                            children: (
                                <div style={{ maxHeight: '500px', overflow: 'auto' }}>
                                    <Alert
                                        message="达梦数据库语法提示"
                                        description="达梦数据库支持COMMENT ON语法添加注释，自增列使用IDENTITY(1,1)语法"
                                        type="info"
                                        showIcon
                                        style={{ marginBottom: 8 }}
                                    />
                                    <pre style={{ 
                                        backgroundColor: '#f5f5f5', 
                                        padding: '10px',
                                        border: '1px solid #d9d9d9',
                                        borderRadius: '4px',
                                        fontFamily: 'monospace',
                                        whiteSpace: 'pre-wrap',
                                        fontSize: '14px'
                                    }}>
                                        {previewDmSql}
                                    </pre>
                                </div>
                            ),
                        },
                        {
                            key: 'highgo',
                            label: '瀚高数据库SQL',
                            children: (
                                <div style={{ maxHeight: '500px', overflow: 'auto' }}>
                                    <Alert
                                        message="瀚高数据库语法提示"
                                        description="瀚高数据库基于PostgreSQL，支持COMMENT ON语法添加注释，自增列使用序列实现"
                                        type="info"
                                        showIcon
                                        style={{ marginBottom: 8 }}
                                    />
                                    <pre style={{ 
                                        backgroundColor: '#f5f5f5', 
                                        padding: '10px',
                                        border: '1px solid #d9d9d9',
                                        borderRadius: '4px',
                                        fontFamily: 'monospace',
                                        whiteSpace: 'pre-wrap',
                                        fontSize: '14px'
                                    }}>
                                        {previewHighgoSql}
                                    </pre>
                                </div>
                            ),
                        }
                    ]}
                />
                
                <Alert
                    message="注意事项"
                    description={
                        <div>
                            <p>转换结果仅供参考，复杂SQL语句可能需要手动调整。下载前请先检查转换结果是否符合预期。</p>
                            <ul>
                                <li><strong>瀚高数据库</strong>：基于PostgreSQL，表和字段注释使用COMMENT ON语法，自增列使用序列实现</li>
                                <li><strong>达梦数据库</strong>：表和字段注释使用COMMENT ON语法，自增列使用IDENTITY(1,1)语法</li>
                            </ul>
                        </div>
                    }
                    type="warning"
                    showIcon
                    style={{ marginTop: 16 }}
                />
            </Modal>
        </div>
    );
};

export default SqlExportPage; 